<template>
    <div>
         <div class="myServiceList" v-for="(item, index) in serList" :key="index">
             <div class="comName" @click="goto()">{{item.comName}}</div>
             <div class="listfont" @click="goto()">
                 业务类型：{{item.type}}<br/>
                业务状态：{{item.state}}<br/>
                申请时间：{{item.date}}
             </div>
             <div class="listbtn" v-if="item.state=='未提交'">
                 <Button type="info">继续办理</Button>
                 <Button type="error">删除业务</Button>
             </div> 
             <div class="listbtn" v-if="item.state=='等待审核'">
                 <Button @click="goto()">查看进度</Button>
             </div> 
             <div class="listbtn" v-if="item.state=='驳回'">
                 <Button @click="goto()">查看进度</Button>
                 <Button type="error">删除业务</Button>
             </div> 
             <div class="listbtn" v-if="item.state=='待业务确认'">
                  <Button @click="goto()">查看进度</Button>
                 <Button type="info">业务提交</Button>
             </div>    
         </div>    
    </div>
</template>

<script>
    import request from '../../utils/request'
    export default {
        data() {
          return {
            serList:[
                {
                    id:"1",
                    comName:'北京微微海新科技发展有限责任公司',
                    type:"设立登记",
                    state:"未提交",
                    date:"2018年09月28日"
                },
                {
                    id:"2",
                    comName:'北京微微海新科技发展有限责任公司',
                    type:"设立登记",
                    state:"等待审核",
                    date:"2018年09月28日"
                },
                {
                    id:"3",
                    comName:'北京微微海新科技发展有限责任公司',
                    type:"设立登记",
                    state:"驳回",
                    date:"2018年09月28日"
                },
                {
                    id:"4",
                    comName:'北京微微海新科技发展有限责任公司',
                    type:"设立登记",
                    state:"待业务确认",
                    date:"2018年09月28日"
                }
            ]
          }
        },
        methods: {
           goto(){
               this.$router.push({name: 'myServiceDetail'})
           }
        },
        mounted() {
           
        }
    }
</script>

<style>
.myServiceList{border-bottom:1px solid #E3E2E2;padding:0.5rem;overflow: hidden;}   
.comName {color:#00B3FF;font-size:0.57rem;}
.listfont {color:#898A8B;float:left;width:50%;line-height:0.7rem;}
.listbtn {float:right;width:50%;padding-top:0.3rem;text-align: right}
</style>
